<template>
  <div class="hospital_cell" @click="lookDetail()">
    <div class="avatar">
      <li-image :src="info.logo" class="img" round v-if="info.logo" :alt="`${$cookies.get('city')}-${info.name}`"></li-image>
      <van-image
        :src="require('@/assets/images/avatar/hosp_default_circle.png')"
        class="img"
        round
        lazy-load
        :alt="`${$cookies.get('city')}-${info.name}`"
        v-else
      />
    </div>
    <div class="info">
      <div class="title">{{ info.name }}</div>
      <div class="rate">
        <!-- <van-rate v-model="info.initScore" allow-half :size="16" color="#FF6600" class="van_rate" readonly /> -->
        <li-rate
          v-model="info.initScore"
          allow-half
          :size="16"
          color="#FF6600"
          class="van_rate"
          readonly
        />
        <span class="star">{{ info.initScore }}分</span>
        <span class="lili_divider"></span>
        <span class="num">{{ info.initAppointmentCnt }}条</span>
      </div>
      <div class="address van-ellipsis">
        <!-- <img src="@/assets/images/goods/location.png" class="img" alt="" /> -->
        {{ info.province }}{{ info.city }}{{ info.district }}{{ info.address }}
      </div>
    </div>
    <slot name="button" />
  </div>
</template>
<script>
import { Rate } from "vant";
export default {
  name: "DetailHospitalTwo",
  components: {
    [Rate.name]: Rate,
  },
  props: {
    info: {
      type: Object,
      default: function () {
        return {};
      },
    },
  },
  data() {
    return {
      value: 4,
    };
  },
  created() {},
  methods: {
    // 查看医院详情
    lookDetail() {
      let o = this.info;
      console.log(o);
      this.$router.push({
        path: `/hospital/detail/${o.id}`,
      });
    },
  },
};
</script>
<style lang="less" scoped>
@import "./hospital_two.less";
</style>